import React, { Suspense, useState } from "react";
import {ConfigProvider} from "antd";
import {BrowserRouter} from "react-router-dom";
import Router from "./router";
import Permission from "@/permission.jsx";
import { Provider } from "react-redux";
import {PersistGate} from "redux-persist/integration/react";
import {persistor, store} from "@/store";
import emitter from "@/utils/mtt.jsx";
export default function App() {
  const [colors, setColors] = useState('');
  emitter.on('editColor',(color)=>{
    console.log(color);
    setColors(color);

  })
    return (
      <ConfigProvider
        theme={{
        // components: {
        //   Menu: {
        //     itemHoverBg: colors||'#168488',//hover的样式
        //     itemSelectedBg: colors||'#168488',//选中的背景色
        //     color: '#000000'
        //     colorText: '#000000',
        //     itemSelectedColor:'#ffffff'
        //   },
        // },
      }}>
        <Provider store={store} >
          <Suspense>
            <PersistGate persistor={persistor}>
              <ConfigProvider>
                <BrowserRouter
                  future={{
                    v7_startTransition: true,
                    v7_relativeSplatPath: true,
                  }}
                >
                  <Permission>
                    <Router></Router>
                  </Permission>
                </BrowserRouter>
              </ConfigProvider>
            </PersistGate>
          </Suspense>
        </Provider>
      </ConfigProvider>
    );
}
